import React from 'react';
import FloatBtn from "../pic/FloatBtn";

import FaSub from 'react-icons/lib/fa/rss-square';
import getThemeColor from "../../utils/themeutil";
import SubsFrame from "./SubsFrame";

class SubscribeBtn extends React.Component {
  state = {
    showModal: false,
  };

  handleSubmit = (info) => {
    this.props.submit(info);
    this.handleHideModal();
  };

  handleHideModal = () => {
    this.setState({
      showModal: false,
    })
  };

  handleSubs = () => {
    this.setState({
      showModal: true,
    })
  };

  render() {
    const {showModal} = this.state;
    return (
      <div>
        <FloatBtn clickFunc={this.handleSubs}
                  children={<FaSub/>}
                  btnStyle={{
                    position: 'fixed',
                    bottom: '1em',
                    left: '1em',
                    backgroundColor: getThemeColor(),
                    fontSize: '.9em',
                    padding: '.1em .1em .1em .2em',
                  }}/>

        {showModal ?
          (
            <SubsFrame cancel={this.handleHideModal} submit={this.handleSubmit}>
            </SubsFrame>
          )
          : null}
      </div>
    );
  }
}

export default SubscribeBtn;
